 <!DOCTYPE html> 
  <html lang="en"> 
  <head> 
  <meta charset="utf-8"> 
  <title>Bootstrap pills based dropdown Navigation Example</title> 
  <meta name="description" content="Bootstrap pills based dropdown Navigation Example">
  <link href="../bootstrap/twitter-bootstrap-v2/docs/assets/css/bootstrap.css" rel="stylesheet">
  <style type="text/css"> 
  .container {
  margin-top: 200px;
  }
  </style>
  </head>
  <body>
  <div class="container">
  <div class="row">  
  <div class="span6">
  <ul class="nav nav-pills">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">FrontEnd<b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li><a href="#">Twitter Bootstrap</a></li>
            <li><a href="#">Google Plus API</a></li>
            <li><a href="#">HTML5</a></li>
            <li class="divider"></li>
            <li><a href="#">Examples</a></li>
          </ul>
        </li>
        <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">BackEnd<b class="caret bottom-up"></b></a>
          <ul class="dropdown-menu bottom-up pull-right">
            <li><a href="#">PHP</a></li>
            <li><a href="#">MySQL</a></li>
            <li><a href="#">PostgreSQL</a></li>
            <li class="divider"></li>
            <li><a href="#">Live Demos</a></li>
          </ul>
        </li>
      </ul>
  </li>
  </ul>
  </div>
  </div>
  </div>
	<script src="../bootstrap/twitter-bootstrap-v2/docs/assets/js/jquery.js"></script>
	<script src="../bootstrap/twitter-bootstrap-v2/docs/assets/js/bootstrap-dropdown.js"></script>
	<script src="../bootstrap/twitter-bootstrap-v2/docs/assets/js/application.js"></script>
  </body>
  </html>  